{% extends "window_layout.html" %}
{% block content %}
    <header>
        <div class="navbar navbar-dark bg-dark shadow-sm">
            <div class="container d-flex justify-content-between">
                <a href='{{ url_for('welcome') }}' class="navbar-brand d-flex align-items-center" style="color: #000;">
                    <img src="static/自然之窗.png" width="20" height="20" class="mr-2">
                    <strong>自然之窗｜{{ web_title}}</strong>
                </a>
                <a href='{{ url_for('welcome') }}' class="btn btn-outline-secondary my-2 btn-sm">返回首页</a>
            </div>
        </div>
    </header>
    <main role="main">
        <div class="album py-5 bg-light" style="background-image:linear-gradient(to right, #ffecd2 0%, #fcb69f 100%) !important">
            <div class="container">
                <div class="my-3 p-3 bg-white rounded shadow-sm">
                    <h4 class=" pt-2 pb-3 mb-0 ml-2">关于我们</h4>
                    <div class="d-flex text-muted pt-3 ml-2">
                        <title>Placeholder</title><text x="90%" y="90%" fill="#ffffff" dy=".4em"></text>

                        <p class="ml-3 pb-3 mb-0 lh-sm border-bottom" style="width: 90%;">
                            <strong class="d-block text-gray-dark mb-1">具备完善的注册与登陆系统</strong>
                            ①、 用户访问网站时，可先通过注册拥有自己的账号后便可登录。<br>
                            ②、 通过列表对用户提交的注册与登录信息进行储存，使得用户在注册后即可马上登录使用。<br>
                            ③、 在注册与登陆界面信息未完善时，会出现警告弹窗，提醒用户将信息完善后才可进行下一步操作。<br>
                            ④、 登陆注册页面均有按钮可点击进行互相跳转。<br>
                            <br>
                            <small><a href='{{ url_for('register') }}'>注册页</a></small>
                        </p>
                    </div>
                    <div class="d-flex text-muted pt-3 ml-2">
                        <title>Placeholder</title><text x="90%" y="90%" fill="#ffffff" dy=".4em"></text>

                        <p class="ml-3 pb-3 mb-0 lh-sm border-bottom" style="width: 90%;">
                            <strong class="d-block text-gray-dark mb-1">网站主题新颖</strong>
                            ①、 以动植物爱好者为目标用户，向他们提供了信息浏览的平台。<br>
							②、 我们关注濒危动植物，从了解它们做起。<br>
                            ③、 通过这样一个方式，引起人们对大自然事物的关注。<br>
                            ④、 引导人们保护自然爱护自然尊重自然，与自然和谐共生。<br>
                            <br>
                            <small><a href='{{ url_for('upload') }}'>登陆后页</a></small>
                        </p>
                    </div>
                    <div class="d-flex text-muted pt-3 ml-2">
                        <title>Placeholder</title><text x="90%" y="90%" fill="#ffffff" dy=".4em"></text>

                        <p class="ml-3 pb-3 mb-0 lh-sm " style="width: 90%;">
                            <strong class="d-block text-gray-dark mb-1">页面布局样式统一</strong>
                            ①、 使用了Bootstrap的样式模板。<br>
                            ②、 页面的背景以渐变色为主，给人带来一种愉悦的感受。<br>
                            <br>
                            <small><a href='{{ url_for('welcome') }}'>首页</a></small>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </main>
{% endblock content %}
